<%-- 
    Document   : registrarAsistencia
    Created on : 17/11/2010, 10:35:55 AM
    Author     : yngrdyn
--%>
<%@ include file='../Templates/security.jsp' %>
<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic" %>
<%@ taglib uri="http://struts.apache.org/tags-nested" prefix="nested" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<h1 class="title">Registro de Asistencias</h1>
<hr>
<br>
<center>
    <html:form action="/personalAsist" styleId="listaPersonalGuardiaForm" onsubmit="return javascript:void(0);">
        <table cellspacing="5">
            <tr>
                <td>Fecha de la guardia:</td>
                <td><html:text property="fecha" styleId="fecha" styleClass="filter"/>
                    <html:errors property="faltaFecha"/>
                    <html:errors property="format_Fecha"/>
                </td>
            </tr>
            <tr>
                <td>Sede:</td>
                <td>
                    <select id="Sedes" name="nombreSede" class="filter"></select>
                    <html:errors property="falta_Sede"/>
                </td>
            </tr>
        </table>
        <html:button property="" value="Buscar" styleClass="button" styleId="listarPersonalGuardia"/>
        <html:button property="" styleId="Asistencias" value="Atr&aacute;s" />
    </html:form>
    <div id="obs"></div><br>
    <div id="consultarPersonal">
        <input type="hidden" id="sedeSelected"/>
        <input type="hidden" id="fechaSelected"/>
        <table cellpadding="0" cellspacing="0" border="0" id="table" class="sortable"  >
            <thead id="head">
                <tr>
                    <th><h5><div class="ordenar" onclick="orden('cedula');" >Cedula</div></h5></th>
                    <th><h5><div class="ordenar" onclick="orden('nombre_1');" >Nombre</div></h5></th>
                    <th><h5><div class="ordenar" onclick="orden('apellido_1');" >Apellido</div></h5></th>
                    <th><h5><div class="ordenar" onclick="orden('id_grupo');" >Grupo</div></h5></th>
                    <th><h5><div class="ordenar" onclick="orden('funcion');" >Funcion</div></h5></th>
                    <th><h5><div class="ordenar" onclick="orden('horainicio');" >Horario</div></h5></th>
                    <th class="oculta"><h5><div class="idGuardia">Guardia</div></h5></th>
                    <th><h5> Registrar </h5></th>
                </tr>
            </thead>
            <tbody id="resultado"></tbody>
        </table>
        <%@ include file="../Templates/paginasTabla.jsp" %>
        <div id="detallesPersona"></div>
    </div>
    <div id="registroAsistencia"></div>
</center>
<script type="text/javascript">
    $(function(){
        listaSedes();
        $('#consultarPersonal').hide();
        $('#fecha').datepicker({
            dateFormat: 'dd/mm/yy',
            maxDate: new Date(),
            defaultDate: new Date(),
            showOn: "button",
            buttonImage: "style/images/calendar.gif",
            buttonText: "calendario"
        }).attr('readonly', true);
        $('#registroAsistencia').dialog("destroy");
        $('#registroAsistencia').dialog({
            autoOpen: false,
            title: 'Registro de Asistencia'
        });
        $('#registroAsistencia').hide();
    });

    $('#listarPersonalGuardia').click(listarPersonalGuardia);

    function listarPersonalGuardia(){
        $('#sedeSelected').val($('#Sedes').val());
        $('#fechaSelected').val($('#fecha').val());
        limit = $('#limit').val();
        $.ajax({
            type: 'GET',
            url: "personalAsist.do?limit="+limit+"&offset="+offset+"&order="+order+"&asc="+asc,
            data: $('#listaPersonalGuardiaForm').serialize(),
            dataType: 'json',
            success: processListaPersonalGuardia
        });
    }

    function processListaPersonalGuardia(data){
        $('#resultado').empty();
        $.each(data.personal , function(i,item){
            if ( (i % 2) == 0) fila = $("<tr bgcolor='#fff' id='persona_"+item.ci+"' class='personaRow'>");
            else fila = $("<tr bgcolor='#ecf2f6' id='persona_"+item.ci+"' class='personaRow'>");

            fila.append($("<td class='cedula'>").append(item.ci));
            fila.append($("<td class='nombre'>").append(item.nombre1));
            fila.append($("<td class='apellido'>").append(item.apellido1));
            fila.append($("<td>").append(item.grupo));
            fila.append($("<td>").append(item.funcion));
            fila.append($("<td>").append(item.inicio+"<br>"+item.fin));
            fila.append($("<td class='idGuardia oculta'>").append(item.guardia));
            if(!item.condicion )
                fila.append($("<td>").append("<a href='javascript:void(0);' class='registrarAsistencia'>Registrar</a>"));
            else if(!item.llegada)
                fila.append($("<td>").append(item.condicion));
            else {
                horas = "Llegada: "+item.llegada;
                horas += !item.salida ? "" : "<br>Salida: "+item.salida;
                fila.append($("<td>").append(horas));
            }

            $('#resultado').append(fila);
        });

        $('.registrarAsistencia').click(function(){
            id = $(this).parent().parent().attr('id').toString();
            registrarAsistenciaMenu(id);
        });

        tam = data.tam
        if(tam==0){
            $("#obs").html('<h4>No hay resultados que coincidan con los parametros dados.</h4>');
            $("#consultarPersonal").hide();
        } else {
            $("#obs").html('OBSERVACIÓN: Para ordenar la tabla por un campo específico, presionar el nombre de la columna.');
            $("#currentpage").html((offset/limit)+1);
            $("#pagelimit").html(Math.ceil(tam/limit));
            $("#consultarPersonal").show();
        }
    }

    function registrarAsistenciaMenu(id){
        $('#registroAsistencia').load('Modulo4/registrarAsistenciaDialog.jsp',{
            ci : $('#'+id+' .cedula').html(),
            nombre : $('#'+id+' .nombre').html()+" "+$('#'+id+' .apellido').html(),
            idGuardia : $('#'+id+' .idGuardia').html(),
            nombreSede : $('#sedeSelected').val(),
            fecha : $('#fechaSelected').val()
        });
    }
</script>
